<template>
    <el-container>
        <el-header>
            <div class="left-panel">
                <el-button type="primary" @click="checkPlan">选择生产计划</el-button>
                <el-button type="primary" @click="checkSale">选择销售单</el-button>
                <el-button type="primary" @click="checkGoods(2)">选择产品</el-button>
            </div>
            <div class="right-panel">
                <el-button type="success" @click="compute" v-if="groupId == '4'">开始运算</el-button>
                <el-button type="info" @click="refresh">清空当前列表</el-button>
            </div>
        </el-header>
        <el-header class="header-tabs">
            <el-tabs type="card" v-model="groupId" @tab-change="tabChange">
                <el-tab-pane label="生产计划" name="4"></el-tab-pane>
                <el-tab-pane label="毛需求-树" name="2"></el-tab-pane>
                <el-tab-pane label="毛需求-表" name="1"></el-tab-pane>
                <el-tab-pane label="生产及采购计划" name="3"></el-tab-pane>
            </el-tabs>
        </el-header>
        <!-- 生产计划 -->
        <el-main class="nopadding" v-if="groupId == '4'">
            <!-- <scTable ref="table" :data="data" remoteSort remoteFilter height="300" hidePagination hideDo>
                <el-table-column type="index" label="序号" fixed align="center" width="50"></el-table-column>
                <el-table-column prop="mater_code" label="物料编码" align="center"></el-table-column>
                <el-table-column prop="goods_code" label="商品编码" align="center"></el-table-column>
                <el-table-column prop="goods_name" label="商品名称" align="center"></el-table-column>
                <el-table-column prop="goods_spec" label="商品规格" align="center"></el-table-column>
                <el-table-column prop="number" label="数量" align="center"></el-table-column>
                <el-table-column prop="unit_name" label="单位" align="center"></el-table-column>
            </scTable> -->
            <!-- <scTable ref="table" :data="data" remoteSort remoteFilter height="350" hidePagination hideDo> -->
            <scTable ref="table" :data="data" remoteSort remoteFilter hidePagination hideDo>
                <el-table-column type="index" label="序号" fixed align="center" width="50"></el-table-column>
                <el-table-column prop="order_no" label="单据编号" align="center"></el-table-column>
                <el-table-column prop="create_time" label="单据日期" align="center"></el-table-column>
                <el-table-column prop="goods_name" label="货品编号" align="center"></el-table-column>
                <el-table-column prop="goods_spec" label="货品名称" align="center"></el-table-column>
                <el-table-column prop="goods_spec" label="规格" align="center"></el-table-column>
                <el-table-column prop="unit_name" label="单位" align="center"></el-table-column>
                <el-table-column prop="goods_spec" label="计划数量" align="center"></el-table-column>
                <el-table-column prop="number" label="本次运算数量" align="center">
                    <template #default="scope">
                        <el-input v-model="scope.row.number" placeholder="请输入数量"></el-input>
                    </template>
                </el-table-column>
            </scTable>
        </el-main>
        <!-- 树 -->
        <el-main class="" v-if="groupId == '2'">
            <el-tree ref="treeRef" class="filter-tree" :data="dataTree" :props="defaultProps" default-expand-all :empty-text="'请先添加产品'">
                <template #default="{ node, data }">
                    <span class="custom-tree-node">
                        <span>{{data.code}}</span>
                        <span style="padding:20px">{{node.label}}</span>
                        <span style="padding-right:20px">毛需求: {{data.number}}</span>
                        <span>{{data.unit_name}}</span>
                    </span>
                </template>
            </el-tree>
        </el-main>
        <!-- 表 -->
        <el-main v-if="groupId == '1'">
            <scTable ref="table" :data="dataTable" remoteSort remoteFilter hidePagination hideDo>
                <el-table-column prop="layer" label="级次" align="center"></el-table-column>
                <el-table-column prop="goods.goods_code" label="货品编码" align="center"></el-table-column>
                <el-table-column prop="goods.goods_name" label="货品名称" align="center"></el-table-column>
                <el-table-column prop="goods.goods_spec" label="规格" align="center"></el-table-column>
                <el-table-column prop="goods.unit.unit_name" label="单位" align="center"></el-table-column>
                <el-table-column prop="total_number" label="数量" align="center"></el-table-column>
            </scTable>
        </el-main>
        <el-header v-if="groupId == '3'">
            <div class="left-panel">
                <!-- <el-button type="primary" @click="production">创建生产计划</el-button>
                <el-button type="primary" @click="sale">创建采购计划</el-button> -->
            </div>
            <div class="right-panel">
                <!-- <el-button type="primary" @click="production">生产建议运算</el-button>
                <el-button type="primary" @click="sale">采购建议运算</el-button> -->
                <el-button type="primary" @click="production">生成生产计划</el-button>
                <el-button type="primary" @click="sale">生成采购计划</el-button>
            </div>
        </el-header>
        <el-main class="nopadding" v-if="groupId == '3'">
            <el-form-item label="生产建议" prop="bom_child">
                <sc-form-table ref="table" v-model="product.production" :addTemplate="addTemplate" placeholder="暂无数据" height="300" hideAdd hideDelete showIndex>
                    <el-table-column prop="layer" label="级别" align="center"></el-table-column>
                    <el-table-column prop="goods_code" label="货品编码" align="center"></el-table-column>
                    <el-table-column prop="goods_name" label="货品名称" align="center"></el-table-column>
                    <el-table-column prop="goods_spec" label="规格" align="center"></el-table-column>
                    <el-table-column prop="unit_name" label="单位" align="center"></el-table-column>
                    <el-table-column prop="need_number" label="需求数量" align="center"></el-table-column>
                    <el-table-column prop="stock_number" label="当前库存" align="center"></el-table-column>
                    <el-table-column prop="wait_house_number" label="待入库数量" align="center"></el-table-column>
                    <el-table-column prop="wait_out_number" label="待出库数量" align="center"></el-table-column>
                    <el-table-column prop="number" label="生产数量" align="center">
                        <template #default="scope">
                            <el-input v-model="scope.row.number" placeholder="生产数量" clearable></el-input>
                        </template>
                    </el-table-column>
                </sc-form-table>
            </el-form-item>
            <el-form-item label="采购建议" prop="bom_child">
                <sc-form-table ref="table" v-model="product.sale" :addTemplate="addTemplate" placeholder="暂无数据" height="300" hideAdd hideDelete showIndex>
                    <el-table-column prop="goods_code" label="货品编码" align="center"></el-table-column>
                    <el-table-column prop="goods_name" label="货品名称" align="center"></el-table-column>
                    <el-table-column prop="goods_spec" label="规格" align="center"></el-table-column>
                    <el-table-column prop="unit_name" label="单位" align="center"></el-table-column>
                    <el-table-column prop="need_number" label="需求数量" align="center"></el-table-column>
                    <el-table-column prop="stock_number" label="当前库存" align="center"></el-table-column>
                    <el-table-column prop="wait_house_number" label="待入库数量" align="center"></el-table-column>
                    <el-table-column prop="wait_out_number" label="待出库数量" align="center"></el-table-column>
                    <el-table-column prop="number" label="采购数量" align="center">
                        <template #default="scope">
                            <el-input v-model="scope.row.number" placeholder="采购数量" clearable></el-input>
                        </template>
                    </el-table-column>
                </sc-form-table>
            </el-form-item>
        </el-main>
    </el-container>
    <select-goods v-if="dialog.goods" ref="goodsDialog" @success="goodsUpdate" @closed="dialog.goods=false" :query="{bom:1,system_disable:0}"></select-goods><!-- 直接选择产品 -->
    <select-plan v-if="dialog.plan" ref="planDialog" @success="planUpdate" @closed="dialog.plan = false" :query="{status:1}"></select-plan><!-- 生产计划 -->
    <select-contract v-if="dialog.sale" ref="saleDialog" @success="saleUpdate" @closed="dialog.sale=false" :query="{status:1}"></select-contract><!-- 选择销售单 -->
    <sale-dialog v-if="dialog.saleplan" ref="saleplanDialog" @success="handleSuccess" @closed="dialog.saleplan = false"></sale-dialog><!-- 创建采购计划 -->
    <product-dialog v-if="dialog.productplan" ref="productplanDialog" @success="handleSuccess" @closed="dialog.productplan=false"></product-dialog><!-- 创建生产计划 -->
</template>

<script>
import selectGoods from '@/views/goods/info/selectGoods.vue';
import selectPlan from '@/views/production/plan/selectPlan.vue';
import selectContract from '@/views/sale/contract/selectContract.vue';
import saleDialog from '@/views/procure/plan/save.vue';
import productDialog from '@/views/production/plan/save.vue';
export default {
	name: '计算器',
	components: {
        selectGoods,selectPlan,selectContract,saleDialog,productDialog
	},
	data() {
		return {
            groupId: "4",
            data: [],
            dataTable: [],
            dataTree: [
                // {
                //     id: 1,
                //     label: '电脑',
                //     code:'SPZL00001',
                //     number: "1",
                //     child: [
                //         {id: 11,label: '主机',code:'SPZL00002',number: "2",
                //             child: [
                //                 {id: 111,label: '硬盘',code:'SPZL00004',number: "4",},
                //                 {id: 112,label: '内存',code:'SPZL00005',number: "4",},
                //             ],
                //         },
                //         {id: 12,label: '显示器',code:'SPZL00003',number: "2",
                //             child: [
                //                 {id: 121,label: '液晶',code:'SPZL00006',number: "4",},
                //                 {id: 122,label: '玻璃',code:'SPZL00007',number: "4",},
                //             ],
                //         },
                //     ],
                // },
            ],
            defaultProps: {
                children: 'children',
                label: 'label'
            },
            dialog: {
                goods: false,
                plan: false,
                sale: false,
                saleplan: false,
                productplan: false,
            },
            form:{},
            product:{
                production: [],
                sale: [],
            },
            contract_id: "",
            contract_code: "",
		}
	},
	methods: {
        // 选择单条产品
        checkGoods(e){
            this.dialog.goods = true
            this.$nextTick(() => {
                this.$refs.goodsDialog.open('add').setData(e)
            })
        },
        goodsUpdate(data){
            let array = []
            data.map((item)=>{
                array.push({
                    goods_id:item.id,
                    create_time:item.create_time,
                    goods_name:item.goods_name,
                    goods_spec:item.goods_spec,
                    unit_name:item.unit.unit_name,
                    mater_code:item.material_code,
                    goods_code:item.goods_code,
                    number: 1
                })
            })
            let existingIds = this.data.map(item => item.goods_id);
            for(let i = array.length - 1; i >= 0; i--){
                if(existingIds.includes(array[i].goods_id)){
                    array.splice(i, 1);
                }
            }
            this.data = [...this.data,...array]
        },
        // 选择生产计划
        checkPlan(){
            this.dialog.plan = true
            this.$nextTick(() => {
                this.$refs.planDialog.open('add')
            })
        },
        async planUpdate(data){
            var res = await this.$API.production.plan.detail.get({id:data.id});
            let array = []
            res.data.detail.map(item=>{
                array.push({
                    id:item.id,
                    goods_id:item.goods_id,
                    order_no:data.production_code,
                    create_time:item.create_time,
                    mater_code:item.goods && item.goods.material_code,
                    goods_code:item.goods && item.goods.goods_code,
                    goods_name:item.goods && item.goods.goods_name,
                    goods_spec:item.goods && item.goods.goods_spec,
                    goods_model:item.goods && item.goods.goods_model,
                    unit_name:item.goods && item.goods.unit.unit_name,
                    number:1,
                })
            })
            this.data = array
        },
        // 销售单
        checkSale(){
            this.dialog.sale = true
            this.$nextTick(() => {
                this.$refs.saleDialog.open('add')
            })
        },
        async saleUpdate(data){
            var res = await this.$API.contract.contract.detail.get({id:data.id});
            this.contract_id = res.data.id
            this.contract_code = res.data.contract_code
            let array = []
            res.data.order_detail.map(item=>{
                array.push({
                    id:item.id,
                    goods_id:item.goods_id,
                    order_no:data.contract_code,
                    create_time:item.create_time,
                    mater_code:item.goods && item.goods.material_code,
                    goods_code:item.goods && item.goods.goods_code,
                    goods_name:item.goods && item.goods.goods_name,
                    goods_spec:item.goods && item.goods.goods_spec,
                    goods_model:item.goods && item.goods.goods_model,
                    unit_name:item.goods && item.goods.unit.unit_name,
                    number:1,
                })
            })
            this.data = array
        },
        // 清空数据
        refresh(){
            this.groupId = '4'
            this.data = []
            this.dataTree = []
            this.dataTable = []
            for (const key in this.product) {
                this.product[key] = [];
            }
        },
        async compute(){
            let array = []
            this.data.map(item=>{
                array.push({
                    goods_id:item.goods_id,
                    number:item.number,
                })
            })
            let show_type = this.groupId
            var res = await this.$API.goods.mrp.post({goods:array,show_type:show_type})
            if(show_type == 1) {
                this.dataTable = res.data
            }else if(show_type == 2) {
                let tree = []
                res.data.map(item => {
                    const processChildren = (childList) => {
						console.log('childList',childList)
						if(childList) {
							return childList.map(item1 => {
								const subTree = {
									id: item1.id,
									label: item1.goods && item1.goods.goods_name,
									unit_name: item1.goods && item1.goods.unit.unit_name,
									number: item1.total_number,
								};
								if (item1.child && item1.child.length > 0) {
									subTree.children = processChildren(item1.child);
								}
								return subTree;
							});
						} else {
							this.$alert('查询错误', "提示", {type: 'error'})
						}

                    };
                    tree.push({
                        id: item.id,
                        label: item.goods && item.goods.goods_name,
                        unit_name: item.goods && item.goods.unit.unit_name,
                        number: item.total_number,
                        children: processChildren(item.child)
                    });
                });
                this.dataTree = tree
                this.groupId = '2'
            }else if(show_type == 3){
                let material = []
                res.data.material.map(item=>{
                    material.push({
                        id: item.id,
                        goods_id: item.goods_id,
                        goods_code: item.goods && item.goods.goods_code,
                        goods_name: item.goods && item.goods.goods_name,
                        goods_spec: item.goods && item.goods.goods_spec,
                        goods_model: item.goods && item.goods.goods_model,
                        unit_name: item.goods && item.goods.unit.unit_name,
                        stock_number: item.stock_number,
                        need_number: item.total_number,
                        mater_code: item.mater_code,
                        number: item.total_number,
                        price: item.goods && item.goods.cost_price,
                    });
                })
                this.product.sale = material
                let product = []
                res.data.product.map(item=>{
                    product.push({
                        id: item.id,
                        layer: item.layer,
                        goods_id: item.goods_id,
                        goods_code: item.goods.goods_code,
                        goods_name: item.goods.goods_name,
                        goods_spec: item.goods.goods_spec,
                        goods_model: item.goods.goods_model,
                        unit_name: item.goods.unit.unit_name,
                        stock_number: item.stock_number,
                        need_number: item.total_number,
                        mater_code: item.mater_code,
                        number: item.total_number,
                        price: item.goods.cost_price,
                    });
                })
                this.product.production = product
            }
        },
        tabChange(e){
            this.groupId = e
            if(e != 4){
                this.compute()
            }
        },
        // 创建生产
        production(){
            let form = {
                data: this.product.production,
                contract_id: this.contract_id,
                contract_code: this.contract_code,
            }
            this.dialog.productplan = true
			this.$nextTick(() => {
				this.$refs.productplanDialog.open('mrpadd').createProduct(form)
			})
        },
        // 创建采购
        sale(){
            this.dialog.saleplan = true
			this.$nextTick(() => {
				this.$refs.saleplanDialog.open('mrpadd').createSale(this.product.sale)
			})
        },
	}
}
</script>

<style lang="scss">
    .filter-tree{
        padding: 20px;
    }
</style>
